<!DOCTYPE html>
<!--suppress ALL -->
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>arrayToHtmlList</title>
</head>
<body>
<h4>
    Converts the given array elements into
    <li> tags and appends them to the list of the given id.
        Use Array.map() and document.querySelector() to create a list of html tags.
</h4>
<h4>
    将给定的数组元素转换为<li>标签并将它们附加到给定id的列表中。
        使用Array.map（）和document.querySelector（）来创建一个html标签列表
        map() 方法返回一个新数组，数组中的元素为原始数组元素调用map()传入函数处理后的值
        querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素
</h4>
<button id="myListID" type="button" onclick="click">This is a button
</button>
<script type="text/javascript">
    const arrayToHtmlList = (arr, listID) => arr.map(item =>
        (document.querySelector("#" + listID).innerHTML += "<li>${item}</li>>"));
    console.log(arrayToHtmlList(['item 1', 'item 2'], 'myListID'))
</script>
</body>
</html>